.data-query {
  width: 50%;
  padding: @padding-sm @padding-md;
  display: flex;
  flex-direction: column;
}

.query-config {
  display: flex;
  flex-direction: column;
}

.result,
.agg {
  height: @height-lg;
}

.result {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.agg {
  display: flex;
  align-items: center;
  justify-content: space-between;

  :global {
    .ant-radio-button-wrapper {
      flex: 1;
      text-align: center;
    }
  }
}

.update {
  margin-top: @margin-md;
}

.query-field {
  flex: 1;
  height: 0;
  margin-right: -@margin-lg;
  padding-right: @padding-md;
  margin-bottom: @margin-lg;
  overflow-y: overlay;

  label {
    margin-bottom: @margin-md;
  }
}

.required {
  &::before {
    display: inline-block;
    margin-right: 4px;
    color: @error-color;
    font-size: 14px;
    font-family: SimSun, sans-serif;
    line-height: 1;
    content: '*';
  }
}

.query-list {
  display: grid;
  row-gap: @margin-lg-1;
  overflow: hidden;
}

.query-item {
  overflow: auto;

  label {
    display: block;
    margin-bottom: @margin-md;
  }
}

.field-list {
  .field-item {
    &:last-child {
      margin-bottom: 0;
    }
  }
}

.field-item,
.item-placeholder {
  height: @height-base;
  display: flex;
  align-items: center;
}

.field-item {
  position: relative;
  margin-bottom: @margin-md;
  padding-right: @margin-md;
  border: 1px solid @border-color-base;
  border-left: none;

  &.dimension {
    &::before {
      background: @color-dimension;
    }
  }

  &.measure {
    &::before {
      background: @color-measure;
    }
  }

  &::before {
    display: inline-block;
    width: 2px;
    height: 32px;
    content: '';
  }

  span {
    margin-left: @margin-md;
  }
}

.dropable {
  background: #f2f7ff;
}

.item-placeholder {
  color: @disabled-color;
  text-indent: @padding-sm;
  border: 1px dashed @border-color-base;
}
